<div class="card border-info m-3">
    <h5 class="card-header bg-info text-white">新增</h5>
    <div class="card-body">
        <h5 class="card-title">基础信息</h5>
        <p class="card-text">请按内容提示，录入相关信息。</p>
        <div class="row mb-3">
            <div class="col-6">
                <div class="input-group">
                    <div class="input-group-prepend w-25">
                        <button class="btn btn-info border-info w-100" type="button">编号</button>
                    </div>
                    <input type="text" class="form-control border-info" [(ngModel)]="domain.serNum">
                </div>
                <span class="badge badge-danger" *ngIf="errRes?.error?.detail['WmsStockTransfer.serNum'] !== null">{{errRes?.error?.detail['WmsStockTransfer.serNum']}}</span>
            </div>
            <div class="col-6">
                <div class="input-group">
                    <div class="input-group-prepend w-25">
                        <button class="btn btn-info border-info w-100" type="button">备注</button>
                    </div>
                    <input type="text" class="form-control border-info" [(ngModel)]="domain.serMemo">
                </div>
            </div>
        </div>
        <div class="row mb-3">
            <div class="col-12">
                <div [froalaEditor] [(froalaModel)]="domain.serEditorContent">Hello, Froala!</div>
            </div>
        </div>

        <div class="row mb-3">
            <div class="col-4">
                <ng-select [items]="extend.domain.inWareHoseName.items"
                           [multiple]="false"
                           [closeOnSelect]="true"
                           [searchable]="true"
                           bindLabel="name" bindValue="id"
                           placeholder="调入仓库"
                           tooltip="{{extend.domain.inWareHoseName.nickname}}"
                           (change)="extend.domain.inWareHoseName.change($event)">
                </ng-select>
            </div>
            <div class="col-4">
                <ng-select [items]="extend.domain.outWarehouseName.items"
                           [multiple]="false"
                           [closeOnSelect]="true"
                           [searchable]="true"
                           bindLabel="name" bindValue="id"
                           placeholder="调出仓库"
                           tooltip="{{extend.domain.outWarehouseName.nickname}}"
                           (change)="extend.domain.outWarehouseName.change($event)">
                </ng-select>
            </div>
        </div>
       <!-- <div class="row mb-3">
            <div class="col-4">
                <ng-select [items]="extend.domain.gooBaseGoods.items"
                           bindLabel="name"
                           bindValue="id"
                           [searchable]="true"
                           [multiple]="false"
                           [closeOnSelect]="true"
                           placeholder="{{extend.domain.gooBaseGoods.nickname}}"
                           tooltip="{{extend.domain.gooBaseGoods.nickname}}"
                           (change)="extend.domain.gooBaseGoods.change($event)">
                </ng-select>
            </div>
            <div class="col-4">
                <ng-select [items]="extend.domain.gooBaseGoodsSpecification.items"
                           bindLabel="name"
                           bindValue="id"
                           [searchable]="true"
                           [multiple]="false"
                           [closeOnSelect]="true"
                           placeholder="{{extend.domain.gooBaseGoodsSpecification.nickname}}"
                           tooltip="{{extend.domain.gooBaseGoodsSpecification.nickname}}"
                           (change)="extend.domain.gooBaseGoodsSpecification.change($event)">
                </ng-select>
            </div>
        </div>-->
      <!--  <div class="row mb-3">
            <div class="col-auto">
                <table class="table table-bordered text-nowrap bg-light zero3-list-table">
                    <thead class="sticky-top">
                    <tr class="text-center table-primary">
                        <th scope="col" (click)="head.tr.selectedAll.click($event)">
                            <fa-icon [icon]="head.tr.selectedAll.icon"></fa-icon>
                        </th>
                        <th scope="col"><span>商品图片</span></th>
                        <th scope="col"><span>商品名称</span></th>
                        <th scope="col"><span>规格名称</span></th>
                        <th scope="col"><span>品牌</span></th>
                        <th scope="col"><span>分类</span></th>
                        <th scope="col"><span>货位号</span></th>
                        <th scope="col"><span>货品编号</span></th>
                        <th scope="col"><span>操作</span></th>
                    </tr>
                    </thead>
                    <tbody>
                    <ng-container *ngFor="let item of data?.page?.content; let i = index">
                        <tr (click)="body.tr.click($event, item?.uuid)" tooltip="{{item?.serNum}}"
                            [ngClass]="{'row-selected': body.tr.isSelected(item?.uuid)}">
                        <tr>
                            <th scope="row" class="text-center">{{i + 1}}</th>
                            <td>{{item.value.serItemName}}</td>
                            <td>{{item.value.serItemSerNum}}</td>
                            <td>{{item.value.serItemImg}}</td>
                            <td>{{item.value.serSpecificationName}}</td>
                            <td>{{item.value.serSpecificationName}}</td>
                            <td>{{item.value.serSpecificationName}}</td>
                            <td><input type="number" [(ngModel)]="item.value.count" class="form-control"/></td>
                            <td>
                                <button class='btn btn-outline-secondary btn-sm'
                                        (click)="func.deleteGooBaseGoodsSpecification(item.key)">
                                </button>
                            </td>
                        </tr>
                    </ng-container>
                    </tbody>
                </table>
            </div>
        </div>-->
        <div class="row mb-3">
            <div class="col-8">
                <table class="table table-bordered text-nowrap bg-light zero3-list-table">
                    <thead class="sticky-top">
                    <tr class="text-center table-primary">
                        <th scope="col"><span>操作</span></th>
                        <th scope="col"><span>商品名称</span></th>
                        <th scope="col"><span>商品编号</span></th>
                        <th scope="col"><span>商品图片</span></th>
                        <th scope="col"><span>规格名称</span></th>
                        <th scope="col"><span>数量</span></th>
                    </tr>
                    </thead>
                    <tbody>
                    <ng-container *ngFor="let item of wmsStockDetailMap | keyvalue">
                        <tr>
                            <td>
                                <button class='btn btn-outline-secondary btn-sm'
                                        (click)="func.deleteGooBaseGoodsSpecification(item.key)">删除
                                </button>
                            </td>
                            <td>{{item.value.serItemName}}</td>
                            <td>{{item.value.serItemSerNum}}</td>
                            <td>{{item.value.serItemImg}}</td>
                            <td>{{item.value.serSpecificationName}}</td>
                            <td>1</td>
                        </tr>
                    </ng-container>
                    </tbody>
                </table>
            </div>
            <!--<div class="col-2">
                <button class='btn btn-info' (click)="func.addGooBaseGoodsSpecification()">添加</button>
            </div>-->
                <div class="col-3">
                    <app-wms-select-stock-goods (saveOrder)="addGoods($event)"></app-wms-select-stock-goods>
                </div>
        </div>

        <div class="text-center mt-5">
            <button type="button" class="btn btn-outline-primary" (click)="func.save.req($event)">生成调拨单</button>
            &nbsp;&nbsp;&nbsp;&nbsp;
            <button type="button" class="btn btn-outline-primary" (click)="func.save.req($event)">保存</button>
        </div>
    </div>
</div>

<span class="badge badge-info mr-3" *ngIf="errRes?.error?.timestamp !== null">response time: {{errRes?.error?.timestamp}}</span>
<div *ngIf="false">
    <p>{{errRes.error}}</p>
    <p>{{errRes.error?.code}}</p>
    <p>{{errRes.error?.description}}</p>
    <p>{{errRes.error?.theme}}</p>
    <p>{{errRes.error?.timestamp}}</p>
    <p>{{errRes.error?.detail?.RR?.duration}}</p>
    <p>{{errRes.error?.detail['WmsStockTransfer.serNum']}}</p>
    <p>{{errRes.error?.detail['WmsStockTransfer.serAudit']}}</p>
    <p>{{errRes.error?.detail['WmsStockTransfer.serValid']}}</p>
    <p>{{errRes.error?.detail['WmsStockTransfer.serValid2']}}</p>
    <p>{{errRes.headers}}</p>
    <p>{{errRes.message}}</p>
    <p>{{errRes.name}}</p>
    <p>{{errRes.ok}}</p>
    <p>{{errRes.status}}</p>
    <p>{{errRes.statusText}}</p>
    <p>{{errRes.url}}</p>
</div>
